<div class="breadcrumbs" id="breadcrumbs">
	<script type="text/javascript">try{ace.settings.check('breadcrumbs' , 'fixed')}catch(e){}</script>

	<ul class="breadcrumb">
		<li>
			<a href="#/security/role/list/0">{{'usergroup'|translate}}</a>
		</li>
		<li class="active">{{'list'|translate}}</li>
	</ul>
</div>
<!-- .breadcrumb -->

<div class="page-content">
	<div class="space-6"></div>
	<form class="form-inline">
		<div>
			<span class="input-filter input-icon">
			<label>{{'onlyname'|translate}} :</label>
			<input type="text" class="input-medium input-search" ng-model="queryOptions.name" placeholder="{{'onlyname'|translate}}"
				style="background: url(img/tool/icon_search.png) no-repeat; background-position: 3px 4px; padding-bottom: 1px;"/>
			</span>
			<span style="margin-left: 61px;">
				<button type="button" class="btn btn-default btn-tool btn-fon"
						ng-click="search()" id="search"
						style="background-image: url(img/tool/button_search.png)">{{'search'|translate}}</button>
				<button type="button" class="btn btn-default btn-tool btn-fon"
						ng-click="reset()"
						style="background-image: url(img/tool/icon_reset.png)">{{'reset'|translate}}</button>
				<!-- <button type="button" class="btn btn-default btn-tool btn-fon"
						ng-click="collapsed=!collapsed"
						style="background-image: url(img/tool/icon_more.png); background-position: 5px 8px !important;">{{'moreFilter'|translate}}
				</button> -->
			</span>
		</div>
	</form>
	<!-- <div class="hr hr-dotted hr18"></div> -->
	<div class="space-6"></div>
	
	<div class="row" ng-show="true">
		<div class="col-xs-12">
			<div class="table-responsive">
				<table 
					class="table table-striped table-bordered table-hover" colresizeable>
					<thead>
						<tr>
							<!-- <th>
							<label>
								<input type="checkbox" class="ace" />
								<span
									class="lbl"></span>
							</label>
						</th>
						-->
						<th >{{'select'|translate}}</th>
						<th style="width: 30%; ">{{'onlyname'|translate}}</th>
						<th style="width: 55%; " ng-if="false">{{'privilege'|translate}}</th>
						<th style="width: 20%; ">{{'creater'|translate}}</th>
						<th style="width: 40%; ">{{'description'|translate}}</th>
					</tr>
				</thead>
				<tbody>
					<tr  ng-repeat="item in items"  ng-click="selectRow(item)">
						<td >
							<div class="radio">
								<label>
									<input name="form-field-radio" type="radio"
										ng-value="item" ng-model="$parent.selectItem" class="ace" />
									<span class="lbl"></span>
								</label>
							</div>
						</td>
						<td ng-bind="item.name" title={{item.name}}></td>
						<td ng-bind="changePrivi(item.privileges)" title=changePrivi(item.privileges) ng-if="false"></td>
						<td ng-bind="item.creator" title={{item.creator}}></td>
						<td ng-bind="item.description" title={{item.description}}></td>
					</tr>
				</tbody>
			</table>
		</div>
		<!-- /.table-responsive -->
		<div ng-grid-footer="" class="ng-scope">
			<at-pagination></at-pagination>
			<div class="btn-group">
				<a ng-if="rootPris.security_role_add" class="btn btn-default btn-tool" href="#/security/role/add/0" style="background-image: url(img/tool/icon_+.png); background-color: #82af6f;">
					 {{'add'|translate}}
				</a>
				<a ng-if="rootPris.security_role_edit" class="btn btn-default btn-tool" href="#/security/role/add/{{selectItem.id}}" ng-click="savePageOptions()"
					ng-disabled="selected()" style="background-image: url(img/tool/icon_edit.png)">
					{{'edit'|translate}}
				</a>
				<button ng-if="rootPris.security_role_delete" type="button" class="btn btn-default btn-tool" ng-click="deleteItem()"
					ng-disabled="selected_delete()" style="background-image: url(img/tool/icon_delete.png)">
					{{'delete'|translate}}
				</button>
			</div>
		</div>
	</div>
	<!-- /span -->
</div>
<!-- /row -->
</div>